/**
 * @Description:配置部门根节点
 * @Author: CHEHSHUANG
 * @Date: 2019/1/23
 */
import React, {Component, Fragment} from 'react';
import {Button, Checkbox, Col, Form, message, Row, Tooltip} from "antd";
import {saveTenantAppModules} from "./TenantService";

const FormItem = Form.Item;
const formLayout = {
    labelCol: {span: 6},
    wrapperCol: {span: 16}
}

class ConfigDepartmentRoot extends Component {
    constructor(props) {
        super(props);
        const {tenantAppModule} = this.props;
        this.state = {
            loading: false,
            checkedValue: tenantAppModule?tenantAppModule.map(item=> item.id):[]
        }
    }

    handleChange = (checkedValue) => {
        this.setState({checkedValue:checkedValue});
    }
    handleSave = () => {
        const {checkedValue} = this.state;
        const {editData} = this.props;
        if(checkedValue&&checkedValue.length>0){
            let saveData={parentId:editData&&editData.id,childIds:checkedValue};
            this.setState({loading: true});
            saveTenantAppModules(saveData).then(res => {
                if(res.status.toLowerCase()==="success"){
                    message.success(res.message);
                }else{
                    message.error(res.message);
                }
            }).catch(e => {
            }).finally(() => {
                this.setState({loading: false});
            })
        }else{
            message.error("请选择应用模块")
        }
    }

    render() {
        const {allAppModule} = this.props;
        const {checkedValue,loading} = this.state;
        return (
            <Fragment>
                <Row>
                    <Checkbox.Group
                        style={{width: '100%'}}
                        value={checkedValue}
                        onChange={this.handleChange}
                    >
                        {
                            allAppModule.map((item, i) => {
                                return <Tooltip  key={i} title={item.name} arrowPointAtCenter placement={"left"}>
                                    <Col span={6}>
                                        <Checkbox value={item.id} className={"text-short"}>{item.name}</Checkbox>
                                    </Col>
                                </Tooltip>
                            })
                        }
                    </Checkbox.Group>
                </Row>
              ` <br/>
                <Row type={"flex"} justify={"center"} style={{marginTop: 20}}>
                    <Button
                        type={"primary"}
                        loading={loading}
                        onClick={this.handleSave}
                    >
                        保存
                    </Button>
                </Row>
            </Fragment>
        );
    }
}

export default ConfigDepartmentRoot;
